<!DOCTYPE html>
<html lang="zh-cmn-Hans" xmlns:th="http://www.thymeleaf.org">

<!-- 头部信息 -->
<div class="tab-header" th:fragment="header">
    <div class="inner">
        <div class="pull-left">
            <div class="pull-left">嗨，欢迎来到  <a href="index"><span class="cr">农资商城销售系统</span></a></div>
        </div>
        <div class="pull-right">
            <a href="login" th:if="${userinfo?.id == null}"><span class="cr">登录|注册</span></a>
            <a th:if="${userinfo?.id != null}" href="userSetting"><span class="cr" th:text="${userinfo.username}"></span></a>
            <a th:if="${userinfo?.id != null}" href="logout"><span class="cr">退出</span></a>
            <a href="userOrder">我的订单</a>
        </div>
    </div>
</div>

<!-- 搜索栏 -->
<div class="top-search" th:fragment="topSearch">
    <div class="inner">
        <div class="search-box">
            <form class="input-group">
                <input placeholder="Ta们都在搜......" onkeypress="return event.keyCode != 13;" type="text" id="searchText">
                <span class="input-group-btn">
						<button type="button" id="search">
							<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
						</button>
					</span>
            </form>
        </div>
    </div>
    <script>
        $(function() {
            $('#search').click(function() {
                //获取搜索框的值
                let searchText = $('#searchText').val();
                //判断搜索框的值是否为空
                if (!searchText){
                    DJMask.open({
                        width: "300px",
                        height: "100px",
                        content: "请输入搜索内容！！！"
                    })
                }else{
                    window.location.href = '/mall/searchDetail?searchText='+searchText;
                }
            });
        });
    </script>
</div>

<!-- 右侧菜单 -->
<div class="right-nav" th:fragment="rightNav">
    <ul class="r-with-gotop">
        <li class="r-toolbar-item">
            <a href="userSetting" class="r-item-hd">
                <i class="iconfont icon-user"></i>
                <div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
            </a>
        </li>
        <li class="r-toolbar-item">
            <a href="cart" class="r-item-hd">
                <i class="iconfont icon-cart"></i>
                <div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
            </a>
        </li>
        <li class="r-toolbar-item to-top">
            <i class="iconfont icon-top"></i>
            <div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
        </li>
    </ul>
    <script>
        $(document).ready(function () {
            // 顶部banner轮播
            var banner_swiper = new Swiper('.banner-box', {
                autoplayDisableOnInteraction: false,
                pagination: '.banner-box .swiper-pagination',
                paginationClickable: true,
                autoplay: 5000,
            });
            // 楼层导航自动 active
            $.scrollFloor();
            // 页面下拉固定楼层导航
            $('.floor-nav').smartFloat();
            $('.to-top').toTop({position: false});
        });
    </script>
</div>

<!-- 底部信息 -->
<div class="footer" th:fragment="footer">
    <div class="copy-box clearfix">
        <ul class="copy-links">
            <a>
                <li>农资</li>
            </a>
            <a>
                <li>商城</li>
            </a>
            <a>
                <li>销售</li>
            </a>
            <a>
                <li>系统</li>
            </a>
            <a>
                <li>!!</li>
            </a>
        </ul>
        <!-- 版权 -->
        <p class="copyright">
            © 2005-2017 农资商城销售系统 版权所有，并保留所有权利<br>
            ICP备案证书号：农资商城销售系统
        </p>
    </div>
</div>